<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
	<link href="css/header.css" rel="stylesheet"/>
	<script src="js/app.js"></script>
    <script type="text/javascript" charset="utf-8">
      	mui.init();
			
    </script>
</head>
<body>
	<header class="mui-bar mui-bar-nav title">
		<h1 class="mui-title title-color">理工健身房</h1>
	</header>
	<nav class="mui-bar mui-bar-tab">
		<a class="mui-tab-item mui-active" tabindex="0">
			<span class="mui-tab-label">首页</span>
		</a>
		<a class="mui-tab-item " tabindex="1">
			<span class="mui-tab-label">运动</span>
		</a>
		<a class="mui-tab-item " tabindex="2">
			<span class="mui-tab-label">方案</span>
		</a>
		<a class="mui-tab-item" tabindex="3">
			<span class="mui-tab-label">我的</span>
		</a>
	</nav>
	<script type="text/javascript">
		var navArray = [
			{	pageId: "notice.html",
				pageUrl: "notice.html"
			},
			{	pageId: "sport.html",
				pageUrl: "sport.html"
			},
			{	pageId: "moments.html",
				pageUrl: "moments.html"
			},
			{	pageId: "me.html",
				pageUrl:"me.html"
			}
		];
		var tabStyle = {
			top: "44px",
			bottom: "50px"
		}
		mui.plusReady(function () {
			//设置状态栏样式
			plus.navigator.setStatusBarStyle("light");
			plus.navigator.setStatusBarBackground("#3399FF");
			var first = null;
			//禁止返回
			mui.back = function(){
				
				if(!first){ 
					first = new Date().getTime(); 
					mui.toast('再按一次退出应用','div');  
					setTimeout(function(){ 
					first = null; 
					},2000); 
				}else{ 
					if(new Date().getTime()-first<2000){ 
						plus.runtime.quit();
					}
				}  
		
			}
		    //获取当前的webView对象
			var indexWebview = plus.webview.currentWebview();
			//向当前的webview追加四个webview对象
			for(var i=0;i<navArray.length;i++){
				var navPage = plus.webview.create(navArray[i].pageId,
													navArray[i].pageUrl,
													tabStyle);
				//隐藏webview窗口
				navPage.hide();
				//追加每一个子页面到主页面
				indexWebview.append(navPage);
			}
			plus.webview.show(navArray[0].pageId);
			//批量绑定tap事件,展示不同页面
			mui(".mui-bar-tab").on("tap","a",function(){
				var tabindex = this.getAttribute("tabindex");
				
				// 显示点击的tab选项所对应的页面
				plus.webview.show(navArray[tabindex].pageId, "fade-in", 200);
				
				for (var i = 0 ; i < navArray.length ; i ++) {
					if (i != tabindex) {
						plus.webview.hide(navArray[i].pageId, "fade-out", 200);
					}
				}
			})
			
			// 延时加载
			setTimeout("initData()", "100");
		});
	</script>
</body>


</html>